<template>
  <div id="single-photo" class="single-photo single-photo-new">
    <div id="imgcontainer-2221697" class="photos-feed-item container-open">
      <div class="photos-feed-landscape-2">
        <table cellpadding="0" cellspacing="0" class="photos-feed-item" border="0">
          <tbody>
            <tr>
              <td>
                <img
                  oncontextmenu="return false;"
                  onload="pdata2('photoinfo:2221697','photodata-2221697');"
                  id="img-2221697"
                  class="img-open photos-feed-image photos-feed-image-landscape"
                  :src="this.$store.state.menu.currentSrc"
                  
                />
                <div
                  class="photos-feed-data-horizontal-landscape alldataclosed alldata-2221697"
                >
                  <span class="photos-feed-data-name"
                    ><a href="/">Hans-Wolfgang Hawerkamp</a></span
                  >
                  <span class="photos-feed-data-published"></span>
                </div>
                <div
                  id="imgdata-2221697"
                  class="photos-feed-item-buyprint alldataclosed alldata-2221697"
                >
                  <span style="" class="photos-feed-item-heart" onclick="like('2221697');"
                    ><input type="hidden" id="likestate-2221697" value="0" /><img
                      id="heart-2221697"
                      src="/assets/img/heart2.png"
                  /></span>
                  Buy print
                </div>
              </td>
              <td
                class="photos-feed-data alldataclosed alldata-2221697"
                width=""
                valign="bottom"
              >
                <div class="photos-feed-data alldataclosed alldata-2221697">
                  <span class="photos-feed-data-title">Wasserburg</span>
                  <span class="photos-feed-data-name"
                    ><a href="/">Hans-Wolfgang Hawerkamp</a></span
                  >
                  <span class="photos-feed-data-published">690 published</span>
                </div>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <div id="photodata-2221697">
        <div class="photo-detail">
          <div class="photo-detail-header">Wasserburg</div>
          <div class="photo-detail-author">
            By
            <a href="/hwhawerkamp" class="photo-detail-author-name"
              >Hans-Wolfgang Hawerkamp</a
            >
            in
            <a href="/gallery/architecture" class="photo-detail-author-exhibition"
              >Architecture</a
            >
          </div>
          <div class="photo-detail-like">
            <span class="photos-feed-item-heart" onclick="like('2221697');"
              ><i class="far fa-heart" id="heart2-2221697"></i
            ></span>
            <span
              class="photo-detail-likecount"
              id="likecount-2221697"
              onclick="modal('likes:2221697','1');"
              >27</span
            >
            &nbsp; &nbsp;
            <span
              onclick="location.href='https://1xondemand.com/featured/switch.html?catalogid=2221697';"
              class="photos-feed-item-buyprint2"
              >Buy print</span
            >
          </div>
          <div class="photo-detail-info">"Germany 2016, processed 2022"</div>
          <div class="photo-detail-comments" id="comments-2221697">
            <!-- <div class="photo-detail-comment" id="comment-7266068">
              <div class="photo-detail-comment-name">
                <a href="/wolfgangmothes">Wolfgang Mothes</a>
                <span class="pro-label-medium" onclick="location.href='/subscribe';"
                  >PRO</span
                >
              </div>
              <div class="photo-detail-comment-text">
                Ein sehr schönes Architekturbild mit einer aktuellen Botschaft!
              </div>
            </div> -->
            <div
              id="photo-detail-replies-2221697-7266068"
              class="photo-detail-comment-replies"
            >
              <!-- <div class="photo-detail-comment-reply">
                <div class="photo-detail-comment-name-reply">
                  Hans-Wolfgang Hawerkamp
                  <span class="pro-label-small" onclick="location.href='/subscribe';"
                    >PRO</span
                  >
                </div>
                <div class="photo-detail-comment-text-reply">
                  ganz herzlichen Dank Wolfgang, freue mich über Deine Anerkennung
                </div>
              </div> -->
            </div>
          </div>
        </div>
        <div class="photo-detail-morefrom">
          更多
          <a href="/hwhawerkamp" class="photo-detail-author-name"
            >Hans-Wolfgang Hawerkamp</a
          >
          <span class="photo-detail-published"></span>
        </div>
        <div class="photo-detail-morefrom-spinner" id="spinner-2221697">
          <table border="0" cellpadding="0" cellspacing="0">
            <tbody>
              <tr>
                <td class="faux-image-td" valign="top">
                  <div class="faux-image" id="faux-2221697"><img src="" /></div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-1"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/1449d9a56e91bb7e3dc959f2474fe628-ld.jpg"
                    /></a>
                    <div class="photo-detail-morefrom-spinner-inside-title title-count-1">
                      公寓
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-2"
                  >
                   <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"    src="https://seuppcdn01.1x.com/images/user/23979ced8df1f8e6d524427ef4c6ad25-ld.jpg"
                    /></a>
                    <div class="photo-detail-morefrom-spinner-inside-title title-count-2">
                      停车场
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-3"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/5df0b7acd38f1248c412840a20d2b83e-ld.jpg"
                    /></a>
                    <div class="photo-detail-morefrom-spinner-inside-title title-count-3">
                      减速带
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-4"
                  >
                   <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/106764b4e18d273bf205f1ad8f8ad394-ld.jpg"
                    /></a>
                    <div class="photo-detail-morefrom-spinner-inside-title title-count-4">
                      Sweep
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-5"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/be71c903f412d8d9f328ae63afd9d542-ld.jpg"
                    /></a>
                    <div class="photo-detail-morefrom-spinner-inside-title title-count-5">
                      Cefalu
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-6"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/f76fb6cada12b7e6e2299a2d46b03651-ld.jpg"
                    /></a>
                    <div class="photo-detail-morefrom-spinner-inside-title title-count-6">
                      Hotel Front
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-7"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/b74c191562e359af4636b6e481b6fc9e-ld.jpg"
                    /></a>
                    <div class="photo-detail-morefrom-spinner-inside-title title-count-7">
                      Stairs
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-8"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/ec74481eea65c774e5958e3f851c4439-ld.jpg"
                    /></a>
                    <div class="photo-detail-morefrom-spinner-inside-title title-count-8">
                      Rockin´ Facade
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-9"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/d59d6e26302646abb2394c8fe68399b0-ld.jpg"
                    /></a>
                    <div class="photo-detail-morefrom-spinner-inside-title title-count-9">
                      Atlantic Urbanity
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-10"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/f85f5c8366a182da2bb5792ca94afe00-ld.jpg"
                    /></a>
                    <div
                      class="photo-detail-morefrom-spinner-inside-title title-count-10"
                    >
                      Funchal Reflected
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-11"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"      src="https://seuppcdn01.1x.com/images/user/343afe5e248905caf99443794d137f0a-ld.jpg"
                    /></a>
                    <div
                      class="photo-detail-morefrom-spinner-inside-title title-count-11"
                    >
                      Waterfront Wall
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-12"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/5fa60f3ae7eb0ff38c8f6ed79732b46c-ld.jpg"
                    /></a>
                    <div
                      class="photo-detail-morefrom-spinner-inside-title title-count-12"
                    >
                      Three House
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-13"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/6f2c0546d731fa7698bcd8a624a55f4c-ld.jpg"
                    /></a>
                    <div
                      class="photo-detail-morefrom-spinner-inside-title title-count-13"
                    >
                      Torshavn Offices
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-14"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"      src="https://seuppcdn01.1x.com/images/user/f2f2b4280764e93a9510062074ec32e4-ld.jpg"
                    /></a>
                    <div
                      class="photo-detail-morefrom-spinner-inside-title title-count-14"
                    >
                      Tubes
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-15"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/d21e453f855c51b0162f248a95cb0deb-ld.jpg"
                    /></a>
                    <div
                      class="photo-detail-morefrom-spinner-inside-title title-count-15"
                    >
                      Shadowlamp
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-16"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/4fd89af6a5c7a4e6facfc63e1e5829d7-ld.jpg"
                    /></a>
                    <div
                      class="photo-detail-morefrom-spinner-inside-title title-count-16"
                    >
                      MP Ensemble
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-17"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"    src="https://seuppcdn01.1x.com/images/user/ad7987038d42de985fb9fc2ffcd3402d-ld.jpg"
                    /></a>
                    <div
                      class="photo-detail-morefrom-spinner-inside-title title-count-17"
                    >
                      Facade Art
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-18"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"      src="https://seuppcdn01.1x.com/images/user/b0b9e5697e65ee046371c1dcaa9f4b89-ld.jpg"
                    /></a>
                    <div
                      class="photo-detail-morefrom-spinner-inside-title title-count-18"
                    >
                      Open
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-19"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"    src="https://seuppcdn01.1x.com/images/user/9f13b0688bc8b2747b370fdda95b7076-ld.jpg"
                    /></a>
                    <div
                      class="photo-detail-morefrom-spinner-inside-title title-count-19"
                    >
                      Lines and Shadows
                    </div>
                  </div>
                </td>
                <td class="photo-detail-morefrom-spinner-inside" valign="top">
                  <div
                    class="photo-detail-morefrom-spinner-inside"
                    id="spinner-2221697-20"
                  >
                    <a  href="/#/views/photo"
                            ><img
                            @click="showpoto"     src="https://seuppcdn01.1x.com/images/user/197b48d06cd6055681c750a894a6b528-ld.jpg"
                    /></a>
                    <div
                      class="photo-detail-morefrom-spinner-inside-title title-count-20"
                    >
                      Battle of Windows
                    </div>
                  </div>
                </td>
              </tr>
            </tbody>
          </table>
        </div>
        <div class="photo-detail-share" v-if="false">
          Share
          <span class="photo-detail-share-icons"
            ><a
              href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fgamma.1x.com%2Fphoto%2F2221697"
              target="_blank"
              ><span class="photo-detail-share-icon"
                ><i class="fab fa-facebook-square"></i></span></a
            ><a
              href="https://twitter.com/intent/tweet?text=https%3A%2F%2Fgamma.1x.com%2Fphoto%2F2221697"
              target="_blank"
              ><span class="photo-detail-share-icon"
                ><i class="fab fa-twitter-square"></i></span></a
            ><a
              href="http://pinterest.com/pin/create/button/?url=https%3A%2F%2Fgamma.1x.com%2Fphoto%2F2221697&amp;media=https%3A%2F%2F1x.com%2Fimages%2Fuser%2F40952100b8747a44fd0a47720f6890b8-ld.jpg"
              target="_blank"
              ><span class="photo-detail-share-icon"
                ><i class="fab fa-pinterest-square"></i></span></a
          ></span>
        </div>
        <img
          src="/assets/img/share.png"
          style="display: none"
          onload="fauximage('2221697','');"
        />
      </div>
    </div>
  </div>
</template>

<script>
import $ from "jquery";

export default {
  data() {
    return {
      headerColor: "#409EFF",
      index: "1",
    };
  },
  created() {
    console.log(this.$store.state.menu.currentSrc)
    //console.log($);
  },
  methods: {
      showpoto: function (e) {
    if (e.target.tagName.toUpperCase() === 'IMG') {
         
        
        let temsrc=e.target.src
        temsrc=temsrc.replace('-ld','-hd4')
        this.$store.state.menu.currentSrc=temsrc
        console.log(this.$store.state.menu.currentSrc)
    }
    },
    openPhotoSafe(id) {
      var elementid = event.srcElement.id;
      if (elementid.includes("heart")) {
      } else {
        if (elementid.includes("buyprintlink") || elementid.includes("followbuttons")) {
        } else {
          this.openPhoto(id);
        }
      }
    },
    urlupdate(url) {
      if (url) {
        if (url != window.location.pathname) {
          var current_location = window.location.pathname;
          var urlset = url;
          var titleset = "";
          var currentPage = "";
          //urlupdate(document.getElementById('fp_baseurl').value);
          var ida = current_location.split("/");
          var idb = url.split("/");
          if (ida[1] == "photo" && idb[1] == "photo" && ida[1] != ida[2]) {
            //if(pageready == '1') {
            //        urlupdate(document.getElementById('fp_baseurl').value);
            //}
          }
          if (current_location != urlset) {
            history.pushState(currentPage, titleset, urlset);
          }
        }
      }
    },
    openPhoto(id) {
      // alldataopen

      // profile-container-img-

      if ($("#imgdata-" + id).hasClass("alldataclosed")) {
        if (document.getElementById("profile-container-img-" + id) != null) {
          $("#profile-container-img-" + id).removeClass("profile-container-img-open");
        }
        $(".alldata-" + id).removeClass("alldataclosed");
        $("#img-" + id).removeClass("img-open");
        $("#imgcontainer-" + id).removeClass("container-open");
        $("#photodata-" + id).html("");
        //lastopenedphoto = '';
        this.urlupdate(lastopenurl);
        //lastopenurl = '';
      } else {
        if (document.getElementById("profile-container-img-" + id) != null) {
          $("#profile-container-img-" + id).addClass("profile-container-img-open");
        }
        $(".alldata-" + id).addClass("alldataclosed");
        $("#img-" + id).addClass("img-open");
        $("#imgcontainer-" + id).addClass("container-open");
        // document.getElementById('imgcontainer-' + id).onmousedown=blockRightClick;
        // document.getElementById('imgcontainer-' + id).oncontextmenu=blockDownload;

        $([document.documentElement, document.body]).animate(
          {
            scrollTop: $("#imgcontainer-" + id).offset().top + 1,
          },
          500
        );

        // pdata('photoinfo:'+id,'photodata-'+id);
        //lastopenedphoto = id;
      }
    },
  },
};
</script>
